<template>
  <div class="addClinic">
    <!-- 医生基本信息 -->
    <div>
      <el-form
        :rules="rules"
        ref="sendMsg"
        :model="sendMsg"
        label-position="left"
        label-width="165px"
      >
        <div class="addAgentTitle"><span></span>代理商工商及财务信息</div>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="companyName" label="公司名称">
              <el-input
                v-model="sendMsg.companyName"
                placeholder="请输入工商注册公司名称"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="registerAddr" label="工商注册地址">
              <el-input
                v-model="sendMsg.registerAddr"
                placeholder="请输入工商注册地址"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="creditCode" label="统一社会信用代码">
              <el-input
                v-model="sendMsg.creditCode"
                placeholder="请输入工商注册编号"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="legalPerson" label="工商注册法人">
              <el-input
                v-model="sendMsg.legalPerson"
                placeholder="请输入工商注册法人名称"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item prop="bankName" label="开户行">
              <el-input
                v-model="sendMsg.bankName"
                placeholder="请输入工商注册名称"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="bankAccount" label="开户行账号">
              <el-input
                v-model="sendMsg.bankAccount"
                placeholder="请输入开户行账号"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 营业执照图片 -->
        <el-row>
          <el-col :span="12">
            <el-form-item prop="licenseFileUrl" label="工商营业执照">
              <el-upload
                class="upload-demo"
                drag
                :action="uploadUrl"
                multiple
                list-type="picture"
                :on-success="uploadRightSuccess"
              >
                <i class="el-icon-upload"></i>
                <div class="el-upload__text">
                  将文件拖到此处，或<em>点击上传</em>
                </div>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="addAgentTitle"><span></span>签约合同及套餐授权</div>
        <el-row>
          <el-col :span="12">
            <el-row>
              <el-form-item prop="signStat" label="是否签订合同">
                <el-radio-group v-model="sendMsg.signStat">
                  <el-radio label="1">是</el-radio>
                  <el-radio label="2">否</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-row>
            <el-row>
              <el-form-item prop="contractCode" label="合同编号">
                <el-input
                  v-model="sendMsg.contractCode"
                  placeholder="请输入合同编号"
                ></el-input>
              </el-form-item>
            </el-row>
            <el-row>
              <el-col :span="12"
                ><el-form-item prop="begin" label="合同期限">
                  <el-date-picker
                    v-model="sendMsg.begin"
                    type="date"
                    placeholder="合同开始日期"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    style="width: 100px"
                  >
                  </el-date-picker> </el-form-item
              ></el-col>
              <el-col :span="12">
                <el-form-item prop="end" label="" label-width="40px">
                  <el-date-picker
                    v-model="sendMsg.end"
                    type="date"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    placeholder="合同结束日期"
                    style="width: 100px"
                  >
                  </el-date-picker> </el-form-item
              ></el-col>
            </el-row>
            <el-row>
              <el-form-item prop="packageConfigList" label="授权套餐">
                <el-select
                  v-model="packageConfigList"
                  placeholder="请选择文章标签"
                >
                  <el-option
                    v-for="item in packageList"
                    :key="item.id"
                    :label="item.packageName"
                    :value="item.id"
                    >{{ item.packageName }}</el-option
                  >
                </el-select>
              </el-form-item>
            </el-row>
          </el-col>
          <el-col :span="12" class="rightContext">
            <p>
              1、根据套餐管理里新增的套餐，在下拉框中回显进行多选，并
              且可以进行选择
            </p>
            <p>2、目前选择套餐只做记录，后期会控制矫治器的数量</p>
          </el-col>
        </el-row>
        <el-row>
          <div style="padding: 20px 0">
            <div class="">已选择的套餐</div>
            <el-table
              :data="sendMsg.packageConfigList"
              border
              style="width: 100%"
            >
              <el-table-column
                prop="packageName"
                label="套餐名称"
                align="center"
              >
              </el-table-column>
              <el-table-column prop="intro" label="描述" align="center">
              </el-table-column>
              <el-table-column prop="" align="center" label="套餐价格">
                <template slot-scope="scope">
                  <el-row>
                    <el-col :span="20"
                      ><el-input v-model="scope.row.packageAmountStr"></el-input
                    ></el-col>
                    <el-col :span="4"> &nbsp;元</el-col>
                  </el-row>
                </template>
              </el-table-column>
              <el-table-column prop="" align="center" label="出库单中显示金额">
                <template slot-scope="scope">
                  <el-checkbox
                    v-model="scope.row.showAmount"
                    label="1"
                  ></el-checkbox
                  >出库单中显示金额
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-row>
        <el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item prop="redoMaxNumber" label="矫治器补做">
                免费次数&nbsp;<el-input
                  v-model="sendMsg.redoMaxNumber"
                  style="width: 80px"
                ></el-input
                >&nbsp;次 &nbsp;
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item prop="redoAmount" label-width="0px">
                补做价格&nbsp;<el-input
                  v-model="sendMsg.redoAmount"
                  style="width: 80px"
                ></el-input
                >&nbsp;元
              </el-form-item>
            </el-col>
          </el-row>
        </el-row>
        <el-row>
          <el-form-item prop="reportAmount" label="报告收费">
            <el-radio v-model="reportAmountRadio" label="0">免费</el-radio>
            <el-radio v-model="reportAmountRadio" label="1">收费</el-radio>
            <el-input
              v-model="sendMsg.reportAmount"
              :disabled="reportAmountShow"
              style="width: 80px"
            ></el-input
            >&nbsp;元
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item prop="settleType" label="结算方式">
            <el-select v-model="sendMsg.settleType">
              <el-option
                v-for="item in settleType"
                :key="item.id"
                :value="item.id"
                :label="item.label"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item prop="annexUrl" label="电子合同">
            <el-upload
              class="upload-demo"
              :action="uploadUrl"
              :on-remove="handleRemove"
              :on-success="uploadSuccess"
              list-type="picture"
              :limit="1"
              accept=".jpg,.jpeg,.png,.gif,.bmp,.JPG,.JPEG,.PBG,.GIF,.BMP"
            >
              <el-link
                style="white-space: nowrap"
                type="primary"
                class="dialogBtn"
                round
                ><span v-if="annexUrl">{{ annexUrl }}</span
                ><span v-else>点击上传电子合同</span></el-link
              >
            </el-upload>
          </el-form-item>
        </el-row>
        <div class="addAgentTitle"><span></span>发票信息</div>
        <div class="flexSpace">
          <div class="flexLeft">
            <div class="inputTop" style="width: 160px">
              <el-popover
                ref="popoverREF"
                placement="bottom-start"
                width="700"
                trigger="click"
              >
                <el-row>
                  <el-col :span="12" class="flexBox"
                    ><span class="inlineB">关键字：</span
                    ><el-input
                      placeholder="请输入门诊名称\发票公司\统一社会信用代码"
                    ></el-input
                  ></el-col>
                  <el-col :span="8" class="flexBox"
                    ><span class="inlineB">关键字：</span>
                    <el-select>
                      <el-option label="">请选择</el-option>
                      <el-option
                        :label="item.value"
                        v-for="item in invoiceType"
                        :key="item.id"
                        >{{ item.label }}</el-option
                      >
                    </el-select>
                  </el-col>
                  <el-col :span="4"><el-button>搜索</el-button></el-col>
                </el-row>
                <el-table :data="invoiceList" width="100%">
                  <el-table-column align="center" width="55" label="">
                    <template slot-scope="scope">
                      <el-radio
                        v-model="invoiceRadio"
                        :label="scope.row.invoiceId"
                        @click.native.prevent="getTemplateRow(scope.row)"
                        >&nbsp;</el-radio
                      >
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="date"
                    label="门诊名称"
                  ></el-table-column>
                  <el-table-column prop="invoiceType" label="发票类型">
                    <template slot-scope="scope">
                      <span>{{
                        invoiceTypeChange(scope.row.invoiceType)
                      }}</span>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="invoiceTitle"
                    label="发票公司"
                  ></el-table-column>
                  <el-table-column
                    prop="creditCode"
                    label="统一社会信用代码"
                  ></el-table-column>
                </el-table>
                <div class="flexRight">
                  <div>
                    <el-button
                      type="primary"
                      class="dialogBtn"
                      round
                      @click="invoiceChange"
                      >确定</el-button
                    >
                    <el-button
                      class="dialogBtn"
                      round
                      @click="$refs['popoverREF'].doClose()"
                      >取消</el-button
                    >
                  </div>
                </div>
                <el-button style="margin-right: 12px" slot="reference"
                  >匹配发票信息</el-button
                >
              </el-popover>
            </div>
            <span v-if="pipeiName"> 已匹配{{ pipeiName }}发票信息</span>
          </div>
        </div>
        <el-row>
          <el-form-item prop="invoiceType" label="发票类型">
            <el-radio-group
              v-model="sendMsg.invoiceType"
              :disabled="updateInvoice"
            >
              <el-radio
                :label="item.value"
                v-for="item in invoiceType"
                :key="item.id"
                >{{ item.label }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-row>
        <!-- 税务登记号 -->
        <el-row>
          <el-col :span="12">
            <el-form-item prop="invoiceTitle" label="发票公司名称">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.invoiceTitle"
                placeholder="请输入发票公司名称"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="socialCreditCode" label="税务登记证号">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.socialCreditCode"
                placeholder="请输入税务登记证号"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="itemTitle" label="发票项目">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.itemTitle"
                placeholder="请输入发票项目"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="remark" label="发票备注">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.remark"
                placeholder="请输入发票备注"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="workAddress" label="经营地址">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.workAddress"
                placeholder="请输入经营地址"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="workTel" label="经营电话">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.workTel"
                placeholder="请输入经营电话"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="invoiceBankName" label="开户行">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.invoiceBankName"
                placeholder="请输入开户行"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="accountNumber" label="账 号">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.accountNumber"
                placeholder="请输入账号"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="postAddress" label="发票寄送地址">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.postAddress"
                placeholder="请输入发票寄送地址"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="recieverName" label="发票收件人姓名">
              <el-input
                :disabled="updateInvoice"
                v-model="sendMsg.recieverName"
                placeholder="请输入发票收件人姓名"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item prop="recieverMobile" label="发票收件人电话">
              <el-input
                v-model="sendMsg.recieverMobile"
                :disabled="updateInvoice"
                placeholder="请输入发票收件人电话"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="email" label="电子发票接收邮箱">
              <el-input
                v-model="sendMsg.email"
                :disabled="updateInvoice"
                placeholder="请输入电子发票接收邮箱"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
  </div>
</template>

<script>
// 引入请求
import { getDictMap } from "@/api/system/dictDetail";
import { getUUID } from "@/utils/index";
import { getAliToken } from "@/api/operDocterAdmin";
import { query } from "@/api/packageRule";
import { invoiceQuery } from "@/api/agent";
export default {
  props: [],
  watch: {
    packageConfigList: function (newVal) {
      for (let i = 0; i < this.packageList.length; i++) {
        if (this.packageList[i].id == newVal) {
          this.sendMsg.packageConfigList.push({
            packageName: this.packageList[i].packageName,
            intro: this.packageList[i].intro,
            packageAmountStr: "",
            showAmount: "0",
            packageInfoId: this.packageList[i].id,
          });
        }
      }
    },
    reportAmountRadio: function (newVal) {
      this.reportAmountShow = false;
      if (this.reportAmountRadio ^ 1) {
        this.sendMsg.reportAmount = 0;
        this.reportAmountShow = true;
      }
    },
  },
  computed: {
    user() {
      return this.$store.getters.user;
    },
  },
  data() {
    var reportAmount = (rule, value, callback) => {
      if (this.reportAmountRadio == 0) {
        callback();
      } else {
        if (this.sendMsg.reportAmount > 0) {
          callback();
        } else {
          callback(new Error("请输入收费价格"));
        }
      }
    };
    return {
      uploadUrl: process.env.VUE_APP_LOG_API + "api/aliOSS/uploadfile", // 上传接口
      imgUrl: "",
      // 上传的地址
      uploadImgUrl: "",
      //pipei
      pipeiName: "",
      avatar: "",
      options: [
        {
          value: "选项1",
          label: "黄金糕",
        },
        {
          value: "选项2",
          label: "双皮奶",
        },
        {
          value: "选项3",
          label: "蚵仔煎",
        },
        {
          value: "选项4",
          label: "龙须面",
        },
        {
          value: "1",
          label: "北京烤鸭",
        },
        {
          value: "2",
          label: "北京烤鸭",
        },
        {
          value: "3",
          label: "北京烤鸭",
        },
        {
          value: "4",
          label: "北京烤鸭",
        },
        {
          value: "5",
          label: "北京烤鸭",
        },
        {
          value: "6",
          label: "北京烤鸭",
        },
        {
          value: "7",
          label: "北京烤鸭",
        },
        {
          value: "8",
          label: "北京烤鸭",
        },
        {
          value: "9",
          label: "北京烤鸭",
        },
      ],
      //套餐
      packageList: [],
      packageConfigList: "",
      //是否收费
      reportAmountRadio: "0",
      reportAmountShow: true,
      //电子合同地址
      annexUrl: "",
      radio: "",
      value: "",
      input: "",
      sendMsg: {
        //结算方式
        settleType: [],

        //发票备注
        remark: "",
        //报告收费金额0不收费
        reportAmount: 0,
        //矫治器补做次数
        redoMaxNumber: "",
        //补做价格
        redoAmount: "",
        //合同类型
        contractType: "180",
        //发票类型
        invoiceType: "",
        //合同编号
        contractCode: "",
        //营业执照文件地址
        licenseFileUrl: "",
        //合同附件存储位置
        annexUrl: "",
        //套餐
        packageConfigList: [],
        //发票ID，如选择库里的发票需填写
        invoiceId: "",
      },
      dataObj: {
        policy: "",
        signature: "",
        key: "",
        ossaccessKeyId: "",
        dir: "",
        host: "",
      },
      // 诊所下拉数据
      clinicList: [],
      // 已选择诊所
      chooseClinicList: ["{}"],
      tagStr: "",
      //结算方式
      settleType: [],
      //合同状态
      contractstat: [],
      //发票类型
      invoiceType: "",
      //发票列表
      invoiceList: [],
      //发票选择
      invoiceRadio: "",
      //输入框限制
      updateInvoice: false,
      templateSelection: {},
      rules: {
        companyName: [
          { required: true, message: "请输入公司名称", trigger: "blur" },
        ],
        registerAddr: [
          { required: true, message: "请输入工商注册地址", trigger: "blur" },
        ],
        creditCode: [
          { required: true, message: "请输入工商注册编号", trigger: "blur" },
        ],
        legalPerson: [
          {
            required: true,
            message: "请输入工商注册法人名称",
            trigger: "blur",
          },
        ],
        bankName: [
          { required: true, message: "请输入工商注册名称", trigger: "blur" },
        ],
        bankAccount: [
          { required: true, message: "请输入开户行账号", trigger: "blur" },
        ],
        signStat: [
          { required: true, message: "请输入是否签订合同", trigger: "blur" },
        ],
        contractCode: [
          { required: true, message: "请输入合同编号", trigger: "blur" },
        ],
        begin: [{ required: true, message: "请输入开始日期", trigger: "blur" }],
        end: [{ required: true, message: "请输入结束日期", trigger: "blur" }],
        settleType: [
          { required: true, message: "请选择结算方式", trigger: "blur" },
        ],
        invoiceTitle: [
          { required: true, message: "请输入发票公司名称", trigger: "blur" },
        ],
        socialCreditCode: [
          { required: true, message: "请输入税务登记号", trigger: "blur" },
        ],
        itemTitle: [
          { required: true, message: "请输入发票项目", trigger: "blur" },
        ],
        workAddress: [
          { required: true, message: "请输入经营地址", trigger: "blur" },
        ],
        workTel: [
          { required: true, message: "请输入经营电话", trigger: "blur" },
        ],
        invoiceBankName: [
          { required: true, message: "请输入开户行", trigger: "blur" },
        ],
        accountNumber: [
          { required: true, message: "请输入账号", trigger: "blur" },
        ],
        postAddress: [
          { required: true, message: "请输入发票寄送地址", trigger: "blur" },
        ],
        recieverMobile: [
          { required: true, message: "请输入发票收件人姓名", trigger: "blur" },
        ],
        recieverName: [
          { required: true, message: "请输入发票收件人电话", trigger: "blur" },
        ],
        licenseFileUrl: [
          { required: true, message: "请上传工商营业执照", trigger: "blur" },
        ],
        annexUrl: [
          { required: true, message: "请上传电子合同", trigger: "blur" },
        ],
        invoiceType: [
          { required: true, message: "请选择发票类型", trigger: "blur" },
        ],
        redoMaxNumber: [
          { required: true, message: "请输入补做次数", trigger: "blur" },
        ],
        redoAmount: [
          { required: true, message: "请输入补做价格", trigger: "blur" },
        ],
        reportAmount: [{ validator: reportAmount, trigger: "blur" }],
      },
    };
  },

  mounted() {
    // 获取结算方式
    getDictMap("settle_type").then((e) => {
      this.settleType = e.settle_type;
    });
    // 合同状态
    getDictMap("contract_stat").then((e) => {
      this.contractstat = e.contract_stat;
    });
    // 合同类型
    getDictMap("contract_type").then((e) => {
      this.contractType = e.contract_type;
    });
    // 发票类型
    getDictMap("invoice_type").then((e) => {
      this.invoiceType = e.invoice_type;
    });
    // 出库金额
    getDictMap("show_amount").then((e) => {
      console.log(e);
    });
    //套餐 {enabled:1}
    query().then((e) => {
      this.packageList = e.content;
    });
  },
  methods: {
    //传id
    AddContract(id) {
      this.sendMsg.orgId = id;
      //发票查询 {enabled:1}
      invoiceQuery({ orgId: this.sendMsg.orgId }).then((e) => {
        this.invoiceList = e;
      });
    },
    // 确定匹配赋值
    invoiceChange() {
      if (this.templateSelection.invoiceId) {
        this.updateInvoice = true;
        for (const key in this.templateSelection) {
          this.$set(this.sendMsg, key, this.templateSelection[key]);
        }
        this.pipeiName = this.templateSelection.packageName;
      } else {
        this.updateInvoice = false;
        this.sendMsg.invoiceId = "";
      }
    },
    //单选

    getTemplateRow(row) {
      //获取选中数据
      if (this.templateSelection.invoiceId == row.invoiceId) {
        this.templateSelection = {};
        this.invoiceRadio = "";
        return;
      }
      this.templateSelection = JSON.parse(JSON.stringify(row));
      this.invoiceRadio = this.templateSelection.invoiceId;
    },
    //发票类型转换
    invoiceTypeChange(val) {
      var arr = this.invoiceType;
      for (let i = 0; i < arr.length; i++) {
        if (arr[i].value ^ val) {
          return arr[i].label;
        }
      }
    },
    // 赋值
    getsendMsg(row) {
      this.sendMsg = row;
    },
    //工商上传成功
    uploadRightSuccess(response, file, fileList) {
      this.sendMsg.licenseFileUrl = response.data.url;
    },
    //电子合同上传
    uploadSuccess(response, file, fileList) {
      this.sendMsg.annexUrl = response.data.url;
      this.annexUrl = response.data.url;
    },
    handleRemove() {},
    addFn() {
      this.$refs["sendMsg"].validate((valid) => {
        if (valid) {
          this.sendMsg.createUser = this.user.id;
          var data = JSON.parse(JSON.stringify(this.sendMsg));
          //packageName showAmount
          delete data.packageConfigList.packageName;
          this.$emit("agentAddContractFn", data);
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
  },
};
</script>

<style scoped lang='scss'>
.addAgentTitle {
  font-size: 16px;
  font-family: Microsoft YaHei;
  font-weight: bold;
  line-height: 21px;
  color: #333333;
  opacity: 1;
  padding-bottom: 30px;
  span {
    display: inline-block;
    margin-right: 6px;
    width: 3px;
    height: 18px;
    background: #508fcc;
    opacity: 1;
    vertical-align: middle;
  }
}
.rightContext {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 100px;
  height: 100px;
  line-height: 100px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
.flexSpace {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.flexLeft {
  display: flex;
  padding-bottom: 12px;
  align-items: center;
}
>>> .el-form {
  .el-form-item {
    .el-form-item__label {
      font-family: Microsoft YaHei;
      font-weight: 400;
      font-size: 16px;
      line-height: 26px;
      color: #999999;
    }
    .el-input {
      width: 240px;
      .el-input__inner {
        height: 42px;
        width: 100%;
      }
    }
  }
}

.flexTop {
  display: flex;
  padding-bottom: 12px;
  align-items: top;
}
.addClinic {
  font-size: 14px;

  .inputTitle::before {
    content: " ";
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #ea5f5f;
    border-radius: 4px;
    margin: 0 4px 2px 0;
  }
  // 不带点的标题
  .inputTitleNopoint {
    white-space: nowrap;
    padding-right: 32px;
    padding: 0 32px 0 12px;
  }
}
.upload-demo {
  >>> .el-upload-list {
    display: none;
  }
}
.inlineB {
  display: inline-block;
 width: 80px;
}
.flexBox {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
</style>
